*{
    margin:0;
    padding:0;
    box-sizing: border-box;
}
a{
    text-decoration: none;
    color: #e7e7e7;
}
body{
    font-size: 14px;
    color:#333;
}

li{list-style: none}
.container{
    width:1080px;
    margin:0 auto;

}
.df{
    display:flex;
    align-items: center;
}
// banner
.banner {
    .ban-container{
    //   height: 358px;
        position: relative;
        .ban-desc{
            position: absolute;
            right:0;
            top:0;
            height: 358px;
            width:860px;
            background-color: skyblue;
            display:none;
            z-index: 2;
        }
    }
        .banner-info{
            float:left;
            width:221px;
            line-height: 37px;
            background-color: #845f3f;
            padding:12.5px 30px;
            li:hover{
                background-color:rgba(0,0,0,.5);
                a{color:#845f3f;}
            }
          &:hover .ban-desc{
            display:block;
          }
        }
        .carousel{
            .swiper-button-prev{
                width: 38px;
                height: 38px;
                background: url("/images/yp-icons.2bf57ccf.png") no-repeat 0 -1924px;
                &:hover{
                    background-position: 0 -1798px;
                }
            }
            .swiper-button-next{
                width: 38px;
                height: 38px;
                background: url("/images/yp-icons.2bf57ccf.png") no-repeat 0 -1840px;
                &:hover{
                    background-position: 0 -1882px;
                }
            }
        // float:left;
        //   width:859px;
        a{display:inline-block;cursor:pointer;}
            img{
                height: 358px;
               
                vertical-align: middle;
                
             }  
        }
     
        
         
}
// hero
.column{
    ul{
        display:flex;
        height: 189px;
       padding:0 10px;
       align-items: flex-end;
       text-align: center;
       justify-content: space-between;
       li{
           width:80px;
           span{
               line-height: 40px;
               color:black;
           }
       }
       img{
           width: 80px;
           height: 80px;
           vertical-align: middle;
       }
    }
}

// list
.list{
    margin-top:20px;
 
        h2{
            // display:flex;
            
            line-height: 40px;
            color: #333;
            font-size: 28px;
            font-weight: 400;
            span:first-child{
                margin-left: 12px;
                font-size: 14px;
                color: #999;
            }
            span:last-child{
                font-size: 14px;
                color: #999;
                float:right; 
            }
        
    }
    
    .swiper-slide{
        img{
             width: 266px;
             height: 266px;
             vertical-align: middle;
            }
            h3{
                 line-height: 23px;
                 color:#333;
                 font-size: 19px;
             }
             p{
                color: #666;
                line-height: 22px;
             }
             span{
                 font-size: 22px;
                 line-height: 26px;
                 color: #a92112;
                 &::before{
                     content:"¥";
                 }
          }
    }
    
    
        
   
}
footer{
    margin-top:50px;
    
width:500px;
height: 500px;
background-color: tomato;
color: white;
font-size: 30px;
text-align: center;
line-height: 500px;
}


